<template>
  <div>
    这是详情页
    <div>
      <div>编号：{{ detailInfo.productId }}</div>
      <img :src="detailInfo.imgUrl" alt="" />
      <div>名称：{{ detailInfo.productName }}</div>
      <div>原价：{{ detailInfo.originalPrice }}</div>
      <div>现价：{{ detailInfo.currentPrice }}</div>
      <button @click="intoshop">加入购物车</button>
    </div>
  </div>
</template>

<script>
import { recommendApi, cartAddApi, cartGetApi } from "../utils/api";
export default {
  //   props: ["id"],
  data() {
    return {
      id: "",
      detailInfo: {},
      token: "",
    };
  },
  mounted() {
    this.getData();
    this.token = localStorage.getItem("token");
    console.log(this.token);
    this.id = this.$route.params.id;
  },
  methods: {
    async getData() {
      const res = await recommendApi();
      if (res.status == 0) {
        res.result.list.forEach((ele) => {
          if (ele.productId == this.id) {
            this.detailInfo = ele;
            console.log(ele);
          }
        });
        //productId imgUrl productName originalPrice currentPrice
      }
    },
    //
    intoshop() {
      cartAddApi({
        token: this.token,
        productId: this.detailInfo.productId,
        count: 5,
        standard: "中国",
      }).then((res) => {
        console.log(res);
        if (res.status == 0) {
          cartGetApi({ token: this.token }).then((res) => {
            console.log(res);
          });
        } else {
          alert("加入购物车失败，请先登录");
        }
      });
    },
  },
};
</script>

<style></style>
